<template>
      <a-modal
        :title="addAccountData.title"
        v-model="addAccountData.show"
        width="560px"
        wrapClassName="addUser"
        style="overflow:hidden;"
        @cancel="handleClose">
        <div style="padding:20px 50px 20px 50px;box-sizing:border-box;width:100%">
        <el-row>
            <el-form :rules="rules" ref="account" size="small" :model="parames" label-width="100px" label-position="left">
                <el-form-item label="账户类型:" prop="accountType">
                  <el-select style="width:100%" @change="changeType"  v-model="parames.accountType" placeholder="请选择">
                      <el-option v-for="(item,index) in accountTypeList" :key="index" :label="item.desc" :value="item.name"></el-option>
                  </el-select>
                </el-form-item>
                <el-form-item :label="accounTitle" prop="accountNumber">
                  <el-input  v-model="parames.accountNumber" placeholder="请输入"></el-input>
                </el-form-item>
                <el-form-item :label="accounName" prop="accountName">
                  <el-input  v-model="parames.accountName" placeholder="请输入"></el-input>
                </el-form-item>
                <el-form-item v-if="parames.accountType == 'BANK'" label="开户行" prop="depositBank">
                  <el-input  v-model="parames.depositBank" placeholder="请输入"></el-input>
                </el-form-item>
            </el-form>
        </el-row>
        </div>
        <span slot="footer" class="dialog-footer">
            <el-button size="small" @click="handleClose">取消</el-button>
            <el-button size="small" type="primary" @click="handleSend">确定</el-button>
        </span>
      </a-modal>
</template>

<script>
export default {
    props: ['addAccountData'],
    data() {
        return {
          accountTypeList: [],
          accounTitle: '银行账号',
          accounName: '真实姓名',
          parames: {
            providerId: '',
            accountType: 'BANK', //账户类型
            accountNumber: '', //账号
            accountName: '', //账号名称
            depositBank: '' //开户行
          },
          data: {},
          rules: {
            accountType: [
              { required: true, message: "请选择", trigger: ['blur','change'] },
            ],
            accountNumber: [
              { required: true, message: "请输入", trigger: ['blur','change'] },
            ],
            accountName: [
              { required: true, message: "请输入", trigger: ['blur','change'] },
            ],
            depositBank: [
              { required: true, message: "请输入", trigger: ['blur','change'] },
            ]
          },
        };
    },
    computed: {

    },
    created() {

    },
    mounted() {

    },
    watch: {

    },
    methods: {
        changeType () {
          if (this.parames.accountType == 'BANK') {
            this.accounTitle = '银行账号'
            this.accounName = '真实姓名'
          } else if (this.parames.accountType == 'ALIPAY') {
            this.accounTitle = '支付宝账号'
            this.accounName = '真实姓名'
          } else if (this.parames.accountType == 'WE_CHAT') {
            this.accounTitle = '微信号'
            this.accounName = '微信昵称'
          } else if (this.parames.accountType == 'CASH') {
            this.accounTitle = '身份证号'
            this.accounName = '真实姓名'
          }
        },
        handleSend () { //提交信息
          this.$refs['account'].validate((valid) => {
            if (valid) {
              if (this.addAccountData.type == 'saveEdit') { //修改保存成功
                  this.$post(this.$api.postProviderAccountEdit,this.parames).then(response => {
                    if (response.data.succeed) {
                      this.$message({ type:'success',message: '修改成功'})
                      this.$emit('checkRender') //刷新父级页面
                      this.handleClose()
                    }
                  })
                } else if (this.addAccountData.type == 'new') { //新建时新增
                  this.$emit('addAccount',JSON.stringify(this.parames),'new','')
                  setTimeout(() => {
                    this.handleClose()
                  }, 200);
                } else if (this.addAccountData.type == 'newEdit') { //新建时的修改
                  this.$emit('addAccount',JSON.stringify(this.parames),'newEdit',this.addAccountData.index,)
                  this.handleClose()
                } else if (this.addAccountData.type == 'saveNew') { //编辑时修改
                  this.$post(this.$api.postProviderAccountAdd,this.parames).then(response => {
                    if (response.data.succeed) {
                      this.$message({ type:'success',message: '新增成功'})
                      this.$emit('checkRender') //刷新父级页面
                      this.handleClose()
                    }
                  })
                }
            }
          })
        },
        render () {
          this.loading = true
          this.$post(this.$api.postCustomerContactsDel,{ //根据id获取详情商机数据
            customerContactsId: row.id
          }).then(response => {
            if (response.data.succeed) {
              setTimeout(() => {
                this.loading = false
                this.render()
              }, 200);
            }
          })
        },
        handleClose () { //关闭弹窗
            this.addAccountData.show = false
        },
        resetData () {
          this.parames.id = ''
          this.parames.providerId = ''
          this.parames.accountType = 'BANK'
          this.parames.accountNumber = ''
          this.parames.accountName = ''
          this.parames.depositBank = ''
          this.$refs.account.resetFields()
        }
    },
    components: {
    },
    computed: {
      changeDialog () {
        return this.addAccountData.show
      }
    }, 
    watch: {
      changeDialog: {
        handler (curVal, oldVal) {
          if (curVal) {
            this.$utils.getEnumberation('postProviderAccountType','accountTypeList',this) //账户类型
            if (this.addAccountData.type == 'saveEdit' || this.addAccountData.type == 'newEdit') {
              this.parames = JSON.parse(this.addAccountData.data)
            } else if (this.addAccountData.type == 'saveNew') {
              this.parames.providerId = this.addAccountData.id
            }
          } else {
            this.resetData()
          }
        }
      }
    },
};
</script>

<style>
.addUser .ant-modal-body{
  padding: 0;
}
</style>